<template>
  <div class="app-container">
    <el-dialog :title="'报工'+'（'+form.orderNo+'）'" :visible.sync="dialogVisible" width="50%" append-to-body>
      <el-form  ref="form" :model="form" v-loading="loading">
        <div class="formDiv">
          <div class="itemDiv">
            <el-form-item label="处理工序" prop="currentStep" required>
              <el-select v-model="form.currentStep" filterable style="width: 100%"
              @change="changeStep">
                <el-option
                  v-for="item in processList"
                  :key="item.stepNo"
                  :label="item.proName"
                  :value="item.stepNo">
                </el-option>
              </el-select>
            </el-form-item>
          </div>
          <div class="itemDiv">
            <el-form-item label="处理意见" prop="result" required v-if="form.currentStep==1">
              <el-select v-model="form.result" filterable style="width: 100%">
                <el-option
                  v-for="item in approveList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="处理意见" prop="result" required v-else>
              <el-select v-model="form.result" filterable style="width: 100%">
                <el-option
                  v-for="item in approveList2"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </div>
          <div class="itemDiv" v-if="form.result=='不合格'">
            <el-form-item label="不合格工序" prop="invalidStep" required >
              <el-select v-model="form.invalidStep" filterable style="width: 100%">
                <el-option
                  v-for="item in processList"
                  :key="item.stepNo"
                  :label="item.proName"
                  :value="item.stepNo">
                </el-option>
              </el-select>
            </el-form-item>
          </div>
          <div class="itemDiv" v-if="form.proType==0">
            <el-form-item label="报工数量" prop="produceNum" required>
              <el-input  type="number" v-model="form.produceNum" :min="0" placeholder="请输入"></el-input>
            </el-form-item>
          </div>
          <div class="itemDiv" v-if="form.proType==1&&form.result=='合格'">
            <el-form-item label="合格数量" prop="validNum" required>
              <el-input  type="number" v-model="form.validNum" :min="0" placeholder="请输入"></el-input>
            </el-form-item>
          </div>
          <div class="itemDiv" v-if="form.proType==1&&form.result=='不合格'">
            <el-form-item label="不合格数量" prop="invalidNum" required>
              <el-input  type="number" v-model="form.invalidNum" :min="0" placeholder="请输入"></el-input>
            </el-form-item>
          </div>
          <div class="itemDiv" v-if="form.proType==1&&form.result=='不合格'">
            <el-form-item label="上一处理人" prop="lastOper" required>
              <el-select v-model="form.lastOper" filterable style="width: 100%">
                <el-option
                  v-for="item in userList"
                  :key="item.worker"
                  :label="item.workerName"
                  :value="item.worker">
                </el-option>
              </el-select>
            </el-form-item>
          </div>
          <div class="itemDiv">
            <el-form-item label="备注" prop="remark">
              <el-input type="textarea" v-model="form.remark" placeholder="请输入"></el-input>
            </el-form-item>
          </div>
        </div>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible=false">取 消</el-button>
        <el-button type="primary" @click="dialogOk">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {reportProduceOrder,getProduceProcess,getProduceUser} from "../../../api/imsMng";

export default {
  dicts:['ims_process_type'],
  data() {
    return {
      loading: false,
      dialogVisible: false,
      form: {
        currentStep:'',
        result:"",
        invalidStep:'',
        remark:''
      },
      processList: [],
      approveList: [
        {label: '完成', value: '完成'},
      ],
      approveList2: [
        {label: '合格', value: '合格'},
        {label: '不合格', value: '不合格'}
      ],
      userList:[]
    }
  },
  methods: {
    show(form) {
      this.dialogVisible = true
      this.resetForm('form')
      this.form.id=form.id
      this.form.flowId=form.flowId
      this.form.orderNo=form.orderNo
      this.load(form.flowId)
    },
    load(flowId) {
      getProduceProcess(flowId).then(res => {
        this.processList = res.data.processStepList
      })
      getProduceUser(this.form.id).then(res=>{
        this.userList=res.data
      })
    },
    changeStep(){
      let obj=this.processList.filter(e=>e.stepNo==this.form.currentStep)[0]
      this.$set(this.form,'proType',obj.proType)
    },
    dialogOk() {
      this.$refs.form.validate(e => {
        if (e) {
          this.loading = true
          reportProduceOrder(this.form).then(res => {
            this.$emit('ok')
            this.dialogVisible = false
            this.$message.success('报工成功')
          }).finally(e => {
            this.loading = false
          })
        }
      })
    },
  }
}
</script>
<style scoped>
.formDiv{
  display: flex;
  flex-flow: wrap;
}
.itemDiv{
  width: 45%;
  margin: 0 10px;
}
</style>
